/* @flow */

import { enter, leave } from '../modules/transition';

// recursively search for possible transition defined inside the component root
// 递归搜索在组件根中定义的可能的转换
function locateNode(vnode: VNode): VNodeWithData {
    return vnode.componentInstance && (!vnode.data || !vnode.data.transition)
        ? locateNode(vnode.componentInstance._vnode)
        : vnode;
}

export default {
    bind(el: any, { value }: VNodeDirective, vnode: VNodeWithData) {
        vnode = locateNode(vnode);
        const transition = vnode.data && vnode.data.transition;
        const originalDisplay = (el.__vOriginalDisplay =
            el.style.display === 'none' ? '' : el.style.display);
        if (value && transition) {
            vnode.data.show = true;
            enter(vnode, () => {
                el.style.display = originalDisplay;
            });
        } else {
            el.style.display = value ? originalDisplay : 'none';
        }
    },

    update(el: any, { value, oldValue }: VNodeDirective, vnode: VNodeWithData) {
        /* istanbul ignore if */
        if (!value === !oldValue) return;
        vnode = locateNode(vnode);
        const transition = vnode.data && vnode.data.transition;
        if (transition) {
            vnode.data.show = true;
            if (value) {
                enter(vnode, () => {
                    el.style.display = el.__vOriginalDisplay;
                });
            } else {
                leave(vnode, () => {
                    el.style.display = 'none';
                });
            }
        } else {
            el.style.display = value ? el.__vOriginalDisplay : 'none';
        }
    },

    unbind(
        el: any,
        binding: VNodeDirective,
        vnode: VNodeWithData,
        oldVnode: VNodeWithData,
        isDestroy: boolean
    ) {
        if (!isDestroy) {
            el.style.display = el.__vOriginalDisplay;
        }
    }
};
